<template>
	<view class="message-container">
		<u-sticky bgColor="#fff">
			<u-tabs :list="list1"></u-tabs>
		</u-sticky>

		<view class="message-list">
			<u-list @scrolltolower="scrolltolower" :height="height" :lowerThreshold='50'>
				<view class="message-list-item" v-for="(item,index) in list" :key="index">
					<view class="message-list-item-right">
						<view class="message-list-item-right-title">
							<font color=red>车型编码：</font>{{item.DERIVE_MATERIAL_CODE}}<br>
							<font color=red>车型名称：</font>{{item.MAT_NAME}}<br>
							<font color=red>订单编号：</font>{{item.ORDER_NO}}<br>
							<font color=red>经销商：</font>{{item.DEALER_SHORTNAME}}<br>
							<font color=red>经销商地址：</font>{{item.DELIVERY_ADDRESS}}
						</view>
						<view class="message-list-item-left-title">
							<font color=red>订单备注：</font>{{item.CHASSIS_REMARK}}
						</view>
						<view class="message-list-item-right-small-text">
							<view class="text"><font color=red>总价:</font>{{item.ORDER_AMOUNT}},  <font color=red>数量：</font>{{item.ORDER_QUANTITY}}台</view>
							<view class="text"><font color=red>接单时间:</font>{{item.CHECK_DATE}}</view>
						</view>
					</view>
				</view>
			</u-list>
		</view>
		<vol-tabbar :index="3"></vol-tabbar>
	</view>
</template>

<script>
	export default {
		methods: {
			scrolltolower() {
				this.tj_options.currentpage=this.tj_options.currentpage+1;
				this.get_data();
			},
			
			get_data(){
				let _tjoptions = encodeURIComponent(JSON.stringify(this.tj_options));
				let turl = "api/customer_jr_mobile/get_jr_saleorder?options="+_tjoptions;
				this.$nextTick(() => {
					this.http.post(turl, {}, true).then((s) => {
						console.log(s);
						s._query.forEach(x=>{
							//console.log(x.DERIVE_MATERIAL_CODE)
							this.list.push({
								DERIVE_MATERIAL_CODE: x.DERIVE_MATERIAL_CODE,
								MAT_NAME: x.MAT_NAME,
								CHASSIS_REMARK: x.CHASSIS_REMARK,
								CHECK_DATE:x.CHECK_DATE,
								DEALER_SHORTNAME:x.DEALER_SHORTNAME,
								DELIVERY_ADDRESS:x.DELIVERY_ADDRESS,
								ORDER_AMOUNT:x.ORDER_AMOUNT,
								ORDER_NO:x.ORDER_NO,
								ORDER_QUANTITY:x.ORDER_QUANTITY
							})
						})
						
					})
				});
			}
		},
		onLoad() {
			uni.hideTabBar({
				animation: false
			})
			let _this = this;
			uni.getSystemInfo({
				success: function(res) {
					_this.height = res.windowHeight - 50;
				}
			});
			//console.log("dfddddload()fd");
			this.get_data();
		},
		onshow() {
			//console.log("dfdfd");
			/* let turl="api/customer_jr_mobile/get_jr_saleorder";
			this.http.post(turl, {}, true).then((s) => {
				console.log(s);
				}) */
		},
		data() {
			return {
				tabledata: [],
				rows: 0, //总行数
				tj_options: {
					//提交给后台查询条件
					currentpage: 1, //当前页
					pagesize: 5, //每页大小
					wheres: {
						form: {
							//用于提交到后端的数据结构
							//year: "",
							//month: "",
							//racct: "all",
							//cntr: "all",
						},
						
					},
					orderby: {
					         ordername: "CreateDate", //table排序字段
					         orderfx: "desc", //asc,desc
					       },
				},
				height: 0,
				list1: [{
					name: '订单信息',
				}, {
					name: '我的OA',
				}],
				list: [],
			}
		}
	}
</script>
<style lang="less" scoped>
	.message-container {
		background-color: #f9f9f9;
	}

	.message-list {
		.message-list-item {
			display: flex;
			margin: 14rpx 14rpx 0 14rpx;
			background: white;
			padding: 16rpx;
			border-radius: 10rpx;
			border: 1px solid #f5f5f5;
		}

		.message-list-item-left {
			margin-right: 16rpx;
		}

		.message-list-item-right {
			display: flex;
			flex-direction: column;

			.message-list-item-right-title {
				flex: 1;
				font-size: 30rpx;
			}

			.message-list-item-right-small-text {
				display: flex;
				font-size: 24rpx;
				color: #a7a7a7;

				.text {
					flex: 1;
				}

				.text:last-child {
					text-align: right;
				}

				.flag {
					padding: 1px 5px;
					border-radius: 3px;
					font-size: 20rpx;
					background: #f44336;
					color: #ffff;
					position: relative;
					top: -2px;
				}
			}
		}
	}
</style>
